<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>EasyUI</title>
        <link rel="stylesheet" type="text/css" href="bower_components/easyui/themes/default/easyui.css"/>
        <link rel="stylesheet" type="text/css" href="bower_components/easyui/themes/icon.css"/>
        <script src="bower_components/jquery/dist/jquery.min.js"></script>
        <script src="bower_components/riot/riot+compiler.min.js"></script>
        <script src="bower_components/easyui/jquery.easyui.min.js"></script>
        <script data-main="js/require_config.js" src="bower_components/require.js" charset="utf-8"></script>
        <script type="riot/tag" src="tages/login.tag"></script>
        <script type="riot/tag" src="tages/login_result.tag"></script>
    </head>
    <body style="margin:0;">
        <div class="easyui-layout" style="width:100%;height:500px;">
            <div data-options="region:'south',split:true" style="height:50px;"></div>
            <div data-options="region:'west',split:true" title="West" style="width:20%;">
                <login></login>
            </div>
            <div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
                <log_result></log_result>
            </div>
        </div>
    </body>
    <script type="text/javascript">
        $(function() {
            $('.easyui-layout').layout('resize', {height: window.innerHeight});
            $(window).resize(function(){
                console.log('on window resize');
                $('.easyui-layout').layout('resize', {height: window.innerHeight});
            });
            riot.mount('*');
        });
    </script>
</html>
